<template>
  <div>
    <div class="i-box" style="--h: 3rem;">
      <XmolBox title="Xliquidfill" style="--freeH: 100%">
        <Xliquidfill v-if="showChart" :seriesData="seriesData"></Xliquidfill>
      </XmolBox>
    </div>

    <section class="content mt10">
      <div>
        <p class="tt">代码示例</p>
        <div v-text='`<Xliquidfill v-if="showChart" :seriesData="seriesData"></Xliquidfill>`'></div>
      </div>
      <div>
        <p class="tt">seriesData</p>
        <p><span class="td">数据参考：</span>{{seriesData}}</p>
        <p class="col-white2">ps:通常此处value值给百分率，0-100；</p>
      </div>
      <div>
        <p class="tt">seriesSet(样式参数)</p>
        <p><span class="td">数据参考：</span>{ color: ['#009DFF'] }</p>
      </div>
    </section>
  </div>
</template>

<script>
export default {
  data () {
    return {
      // 水球图
      seriesData: 50,
      showChart: true
    };
  },
  mounted () {

  },
  methods: {

  }
};
</script>
